<template>
  <div class="address-item">
    <template v-if="$props.addressData && $props.addressData.name">
      <div class="icon">
        <i class="el-icon-location"></i>
      </div>
      <div class="left">
        <div class="line1">
          <div class="name">{{ $props.addressData.name }}</div>
          <div class="mobile">{{ $props.addressData.mobile }}</div>
        </div>
        <div class="line2">
          <span class="default" v-if="$props.addressData.isDefault===1">默认</span>
          {{ $props.addressData.province+','+$props.addressData.city+','+$props.addressData.county}}
        </div>
        <div class="line3">
          <span class="ovd_s">{{ $props.addressData.address }}</span>
        </div>
      </div>
      <div class="right">
        <!--管理地址-->
        <span v-if="$props.showType!==1" @click="edit">
          <i class="el-icon-edit"></i>
          编辑
        </span>

        <!--仅选择地址-->
        <span @click="chooseCurrAddress" v-if="$props.showType===2">
          <i class="el-icon-success"></i>
          选择
        </span>


        <span class="del" v-if="$props.showType!==1"  @click="del">
          <i class="el-icon-delete"></i>
        </span>

        <!--仅选择地址-->
        <span @click="reChooseAddress" v-if="$props.showType===1 && $props.isReChoose!==false">
          <i class="el-icon-refresh-left"></i>
          重新选择
        </span>


      </div>
      <div class="c"></div>
    </template>

    <template v-if="!$props.addressData.id">
      <div align="center">
        <br>
        暂无地址信息，点击
        <el-button
          icon="el-icon-plus"
          type="success"
          @click="createAddress">
          添加
        </el-button>
      </div>
    </template>
  </div>
</template>

<script>
export default {
  name: "AddressItem",
  props: {
    isReChoose:false,
    addressData: Object,
    // 0.管理地址 1.展示地址(仅展示)
    showType:Number,
    callback:Function,
    from:''
  },
  mounted() {
    // console.log('this.$props.addressData',this.$props.addressData)
  },
  methods:{
    edit:function () {
      var query={type:'update',id:this.$props.addressData.id}
      if (this.$props.from){
        query.from=this.$props.from
      }
      this.$router.push({name:'MemberAddressForm',query:query})
    },
    // 获取-地址列表
    del:function () {
      let $this=this
      $this.$confirm('您是否确认要进行当前操作?', '系统提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        $this.MyRequest($this.ApiDoNameMember+'MemberAddress/delete', {
          id:this.$props.addressData.id
        }, function (data) {
          if (typeof $this.$props.callback==='function'){
            $this.$props.callback()
          }
          $this.$forceUpdate()
        }, function (msg) {
          $this.$message.error(msg)
        })
      }).catch(() => {

      })
    },
    // 重新选择地址
    reChooseAddress:function () {
      this.cacheCurrUrl()
      this.$router.push({name:'MemberAddressList',query:{from:'chooseAddress'}})
    },
    createAddress:function () {
      this.cacheCurrUrl()
      this.$router.push({name:'MemberAddressForm',query:{type:'create',from:'chooseAddress'}})
    },
    cacheCurrUrl:function () {
      localStorage.setItem("ConfirmOrderUrl",JSON.stringify({
        name:this.$route.name,
        query:this.$route.query,
      }))
    },
    // 确认选择当前地址,返回【确认订单】页面(带上选择地址ID)
    chooseCurrAddress:function () {
      var string = localStorage.getItem("ConfirmOrderUrl");
      var routeObj=JSON.parse(string)
      routeObj.query.chooseAddressId=this.$props.addressData.id
      // localStorage.removeItem("ConfirmOrderUrl")
      this.$router.push({name:routeObj.name,query:routeObj.query})
    }
  }
}
</script>

<style scoped>

</style>
